<template>
  <el-table
    size="large"
    :class="border?'c-table_border':''"
    :header-cell-style="{
      background: '#F1F1F1',
      color: '#202020',
      'font-size': '14px',
      'font-weight': '500',
    }"
  >
    <slot></slot>
    <template #empty>
      <div class="empty">
        <div class="empty-img">
          <img src="@/assets/img/table-kong.png" />
        </div>
        <div class="empty-title">暂无数据</div>
      </div>
    </template>
  </el-table>
</template>
<script setup>
import { ref } from "vue";
const tableRef = ref();
const props = defineProps({
  border:{
    type:Boolean,
    default:false
  }
})
defineExpose({
  tableRef,
});
</script>
<style lang="less" scoped>
.c-table_border {
  border-top: 1px solid #e9e9e9;
  border-left: 1px solid #e9e9e9;
  border-right: 1px solid #e9e9e9;
}
.empty {
  margin: 44px 0;
  .empty-img {
    width: 66px;
    height: 44px;
    margin: 0 auto;
  }
  .empty-title {
    font-size: 14px;
    color: #9e9e9e;
    text-align: center;
  }
}
</style>
